<template>
  <div class="net-file">
    <div class="file" v-for="file in fileList">
      <el-link :href="file.url"  target="_blank" >
        <i class="el-icon-document"></i> {{file.name}}</el-link>
      <span class="explain-txt2" v-if="showSize">{{file.size}}</span>
    </div>
  </div>
</template>

<script>

import {getFileByFileId} from "@/api/file-controller";

function sizeParse(b) {
  if(b > 1024 * 1024){
    return (b/(1024*1024)).toFixed(2) + 'MB'
  }else if(b > 1024){
    return (b/1024).toFixed(2) + 'KB'
  }else{
    return b + 'B'
  }
}

export default {
  name: 'ImgThumbnail',
  props: {
    fileId: {
      type: String,
      default: ''
    },
    showSize: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      fileList: []
    }
  },
  computed: {
    previewList(){},
  },
  watch: {
    fileId(to) {
      if(to) {
        this.getFile();
      }
    },
  },
  created() {
  },
  mounted() {
    this.getFile();
  },
  methods: {
    getFile(){
      if(!this.fileId) return;
      let tmp = this.fileId.split(',');
      this.fileList = []
      tmp.forEach((item, i) => {
        getFileByFileId(item).then(res => {
          if( res.fileUrl.indexOf("?") !== -1 ){
            res.fileUrlNew = res.fileUrl + '&rename=' + res.name
          }else{
            res.fileUrlNew = res.fileUrl + '?rename=' + res.name
          }
          this.$set(this.fileList, i, {
            name: res.name,
            size: sizeParse(res.fileSize),
            url: this.$store.state.settings.basePath + res.fileUrlNew
          })
        })
      })
    },
    download(path){
      window.open(path, '_blank')
    }
  }
}
</script>

<style lang="scss" scoped>
  .file{
    margin-bottom: 4px;
    span{
      margin-left: 10px;
      font-size: 12px;
    }
  }
</style>
